<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="../js/jquery-1.11.1.js"></script>
		<!--01-元素内容操作: 操作元素和元素内容的方式
		htmL()无参 ---功能:获取匹配元素集合中第一个元素
		      有参---功能:获取匹配元素集合中所有元素并替换
		val()无参---功能:针对表单元素:input、select..
		     获取第一个表单元素的值 【value】
			 有参---功能:针对表单元素:input、select....
		                设置表单元素的值，input直接设置
						select不能直接设置，设置原有value值
		text()无参-----获取匹配元素集合中所有元素的文本内容
		      有参-----[设置]获取匹配元素集合中所有元素的文本内容做替换
		      
		特点:添加内容
		
		-->
	</head>
	<body>
		<h1>html()函数的使用</h1>
		<button>html() 函数 有参</button>
		<span>lorem1</span>
		<span>lorem2</span>
		<h1>val()函数的使用</h1>
		<button>val()函数【input】 无参</button>
		<input type="text"  value="文本框真实数据1">
		<input type="text"  value="文本框真实数据2" placeholder="文本框提示">
		<!-- html:按钮.btn2 select>option*3
		     jq:点击按钮，显示第一个表单元素的值-->
		<br>
		<button class="btn2">val()函数【select】无参</button>
		<button class="btn3">val()函数【select】有参</button>
		<select>
		<option value="rem1">lorem1</option>
		<option value="rem2">lorem2</option>
		<option value="rem3">lorem3</option>
		</select>
		<h1>text()函数使用：包裹内容：文本</h1>
		<button class="btn4">text()函数 无参</button>
		<button class="btn5">text()函数 无参</button>
		<p>lorem4</p>
		<p>lorem5</p>
		<p>lorem6</p>
		<script>
			//抓到无参按钮，点击，打印p的text值
			$(".btn4").click(function(){
				var ptext=$("p").text();
				alert(ptext);
			});
			//抓到有参按钮，点击，改变p中文本的内容:改变效果
			$(".btn5").click(function(){
				$("p").text("改变效果");
			});
			//$(".btn3").click(function(){
			/*下拉列表 抓select元素*/
			//var vals=$("select").val("rem1");
			//抓取打印seclect的JS对象。默认字符串形式表示【object Object】
		    //抓取打印seclect的JS对象。调用对象tostring()方法，如果没有重写【object Object】
		    //设置   第一个option 的 value值
			//$("select").val("rem1");
			//var vals=$("select").val();
			//alert("val()函数针对下拉列表:"+vals)
			//});
			
			
			//$(".btn2").click(function(){
			/*下拉列表 抓select元素*/
			//var vals=$("select").val("");
			//alert("val()函数针对下拉列表:"+vals)
			//});
			
			//$(".btn1").click(function(){
				/*变量名不允许使用关键字  js中关键字 for in 遍历数组*/
				//var in=$("input").val();
				//alert("val()针对input元素 无参"+ins);
			//});
		// 按钮，点击按钮，实现span内容改成lorem lorem
		//$("button").click(function(){
			//$("span").html("<span>lorem</span>");
		//});
		
		/*变量          js变量--jq变量
		int i=1; Java写法 强类型语言
		var i=数值、元素;   Javascript 弱类型语言

		*/
	   //var html=$("span").html();
	  // alert("html()函数的无参值:"+html);
//
    </script>
	</body>
</html>